import React, { useEffect } from "react";
import {
  Alert,
  Layout,
  Row,
  Col,
  Divider,
  Form,
  Button,
  Input,
  InputNumber,
  Checkbox,
  Tooltip,
  Cascader,
  Select,
  DatePicker,
  Radio,
  Rate,
  Switch,
  Slider,
  AutoComplete,
  message,
} from "antd";
import styles from "./index.less";
const orm: any = {
  useName: "nihao",
  password: 1234,
};
export default function BaseForm() {
  const [form] = Form.useForm();
  useEffect(() => {
    form.setFieldValue("useName", "admin");
  }, []);
  // 表单提交
  const onFinish = () => {
    console.log(form);
  };
  return (
    <div>
      <Row>
        <Col>
          <h1>基础表单页面</h1>
        </Col>
      </Row>
      <Row gutter={16}>
        <Col span={12}>
          <div className={styles.box}>
            <Divider orientation="left">基础功能</Divider>
            <Form onFinish={onFinish} form={form}>
              <Form.Item
                label="用户名字"
                rules={[{ required: true, message: "请输入你的用户名字" }]}
                name="useName"
              >
                <Input />
              </Form.Item>
              {/* <Form.Item
                label="密码"
                rules={[{ required: true, message: "请设置密码" }]}
                name="password"
              >
                <input placeholder="请输入密码" />
              </Form.Item> */}
              <Form.Item>
                <Button type="primary" htmlType="submit">
                  Submit
                </Button>
              </Form.Item>
            </Form>
          </div>
        </Col>
        <Col span={12}>第二块</Col>
      </Row>
    </div>
  );
}
